<template>
<div>
    <div class="w3" v-show="Tr_data1 != null">
        <div class="w33" v-for="it,i in Tr_data1" :key="i">
            <div class="w3_1">
                <img :src="it.img || 'https://bbs.mihoyo.com/_nuxt/img/noData.a3d7135.png'" alt="">
                <div class="w3_1_1">
                    <span class="tr1">{{it.title}}</span>
                    <span class="tr2">{{it.txtTil}}</span>
                    <span class="tr3">{{it.time}}</span>
                </div>
            </div>
            <div class="w3_2">
                <div class="an1">编辑</div>
                <div class="an2">删除</div>
            </div>
        </div>
    </div>
    <div class="wwww" v-show="Tr_data1 == null">
        <img src="https://bbs.mihoyo.com/_nuxt/img/noData.a3d7135.png" alt="">
        <!-- <h1>你好呀</h1> -->
    </div>
</div>
</template>

<script>
export default {
    props: ['Tr_data1']
}
</script>

<style lang="less" scoped>
    .wwww {
        // border: 1px solid red;
        margin-left: 60px;
    }
    .w3 {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        .w33 {
            margin-top: 20px;
            width: 100%;
            display: flex;
            justify-content: space-between;
            .w3_1 {
                    display: flex;
                    img {
                        // min-width: 35%;
                        // vertical-align: middle;
                        border-radius: 6px;
                        // height: 80px;
                        object-fit: cover;
                        width:100px;
                        height:100px;
                        cursor: pointer;
                    }
                    .w3_1_1 {
                        width: 200px;
                        margin-left: 5px;
                        color: #999;
                        margin-top: 5px;
                        .tr2 {
                            display: -webkit-box;
                            -webkit-box-orient: vertical;
                            -webkit-line-clamp: 1;
                            overflow: hidden;
                        }
                        span {
                            display: flex;
                            padding: 3px;
                            font-size: 12px;
                            align-items: center;
                        }
                    }
            }
            .w3_2 {
                    display: flex;
                    align-items: center;
                    .an1 {
                        background-color: #00c3ff;
                        width: 40px;
                        text-align: center;
                        color: #fff;
                        border-radius: 4px;
                        padding: 2px;
                        font-size: 14px;
                        margin-right: 10px;
                        cursor: pointer;
                    }
                    .an2 {
                        border: 1px solid #999;
                        width: 40px;
                        text-align: center;
                        border-radius: 4px;
                        padding: 2px;
                        font-size: 14px;
                        margin-right: 10px;
                        cursor: pointer;
                    }
            }
        }
    }
</style>